@import './inline-comment';
@import '../../../../scripts/node_modules/codemirror/addon/scroll/simplescrollbars';

.pull-request-unidiff {
    height: 50vh;

    // scss-lint:disable SelectorFormat
    .CodeMirror-gutter-wrapper:hover > .CodeMirror-gutter-elt {
        background: $tlp-theme-color;
        color: $tlp-ui-white;
        font-weight: 600;
        cursor: pointer;
    }
}

.pull-request-side-by-side-diff {
    width: 50%;
    height: 50vh;
    float: left;

    // scss-lint:disable SelectorFormat
    .CodeMirror-gutter-elt:hover {
        background: $tlp-theme-color;
        color: $tlp-ui-white;
        font-weight: 600;
        cursor: pointer;
    }
}

.pull-request-side-by-side-diff:first-child {
    // scss-lint:disable SelectorFormat
    > .CodeMirror {
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
    }
}

.pull-request-side-by-side-diff:last-child {
    // scss-lint:disable SelectorFormat
    > .CodeMirror {
        border-left: 0;
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
    }
}

.pull-request-file-diff {
    // scss-lint:disable SelectorFormat
    .CodeMirror {
        height: 400px;
        border: 1px solid $tlp-ui-border-normal;
        border-radius: 3px;
    }

    .CodeMirror-gutters {
        border: 0;
    }

    .CodeMirror-gutter {
        min-width: 30px;
        border-right: 1px solid #f6f6f6;
        background: #fdfdfd;
    }

    .CodeMirror-lines {
        font-size: 13px;
        line-height: 20px;
    }

    .CodeMirror-gutter-elt {
        color: #8c8c8c;
        font-size: 11px;
        text-align: center;
    }
}

.pull-request-file-diff-loading {
    height: 50px;
    background: url('/themes/BurningParrot/images/spinner.gif') no-repeat center center;
}

.pull-request-file-diff-section-collapsed {
    cursor: pointer;
}

.pull-request-file-diff-binary-file {
    padding: 100px;
    border: 1px solid #dddddd;
    border-radius: 3px;
    color: #cccccc;
    line-height: 40px;
    text-align: center;

    > i {
        font-size: 40px;
    }
}

.pull-request-file-diff-added-lines {
    background-color: #eff8ef;

    // scss-lint:disable SelectorFormat
    + .CodeMirror-gutter-wrapper .CodeMirror-gutter-elt {
        color: #58b359;
    }
}

.pull-request-file-diff-deleted-lines {
    background-color: #ffe6e6;

    // scss-lint:disable SelectorFormat
    + .CodeMirror-gutter-wrapper .CodeMirror-gutter-elt {
        color: #da5353;
    }
}

.pull-request-file-diff-placeholder-block {
    margin: 0 0 0 13px;
    border-left: 3px solid $tlp-ui-border-normal;
}

.pull-request-new-inline-comment {
    display: flex;
    align-items: center;
    margin: 3px 15px 3px 23px;

    .fa-plus-circle {
        margin: 0 11px 0 0;
        color: $tlp-theme-color;
        font-size: 18px;
    }
}

.pull-request-new-inline-comment-content {
    display: flex;
    flex: 1 1 auto;
    padding: 7px;
    border: 1px solid $tlp-theme-color;
    border-radius: 3px;
    background: $tlp-ui-white;
}

.pull-request-new-inline-comment-text {
    box-sizing: border-box;
    width: 100%;
    height: 43px;
    margin: 0;
    font-size: 13px;
}

.pull-request-new-inline-comment-controls {
    display: flex;

    > button:first-child {
        margin: 0 5px;
    }
}

.pull-request-inline-comment .arrow,
.pull-request-new-inline-comment .arrow {
    flex: 0 0 auto;
    width: 0;
    height: 0;
    border-width: 5px 5px 5px 0;
    border-style: solid;
    border-color: transparent $tlp-theme-color transparent transparent;
}
